/*
 * Copyright 2015-2018 the original author or authors.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
@import "variables";

$trace-point-normal: $gt-yellow;
$trace-point-active: darken($gt-blue, 10%);
$trace-point-error: $gt-red;

.gt-sidebar .dropdown-toggle {
  padding-top: .5rem;
  padding-bottom: .5rem;
  background-color: $secondary !important;
  @include gt-focus-ring;
}

.gt-sidebar .dropdown-toggle:after {
  position: absolute;
  right: 1.25em;
  top: 1.1em;
}

.gt-sidebar .dropdown-menu {
  left: -1px !important;
  right: -1px !important;
  border-color: #d9d9d9;
}

.gt-sidebar .selected {
  display: none;
}

.gt-transaction-sidebar-table-no-more {
  // border-collapse needed for border radius to work
  // see http://stackoverflow.com/questions/10666573/border-radius-of-table-is-not-working
  border-collapse: separate !important;
  border-bottom: 1px solid #d2ba7f;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.gt-transaction-sidebar .gt-sidebar {
  width: 100%;
}

.gt-transaction-sidebar-row:hover {
  background-color: #f5f5f5;
}

@include media-breakpoint-up(md) {
  .gt-transaction-sidebar {
    display: inline-block;
    width: 220px;
    vertical-align: top;
  }

  .gt-transaction-main-column {
    display: inline-block;
    width: 449px;
    // this makes total 20px gap between sidebar and main
    margin-left: 16px;
  }
}

@include media-breakpoint-up(lg) {
  .gt-transaction-sidebar {
    width: 300px;
  }

  .gt-transaction-main-column {
    width: 609px;
  }
}

@include media-breakpoint-up(xl) {
  .gt-transaction-main-column {
    width: 789px;
  }
}

@media screen and (min-width: 1400px) {
  .gt-transaction-main-column {
    width: 989px;
  }
}

@media screen and (min-width: 1600px) {
  .gt-transaction-sidebar {
    width: 400px;
  }

  .gt-transaction-main-column {
    width: 1089px;
  }
}
